<template>
  <el-row>
    <el-col :span="24">
      <bread-crumb currentName="pandakill"></bread-crumb>
    </el-col>
  </el-row>

  <el-row>
    <el-col :span="24">
      <ls-table
        :tableData="tableData"
        :tableTitle="pandaKillTitle"
        :dataConfig="pandaKillConfig"
        :tableConfig="pandaKillTable"
      >
        <template #selction>
          <el-table-column type="selection" width="55" />
        </template>
        <!-- 外号 -->
        <template #label="scope">
          <el-tag
            v-for="item in Format.formatTags(scope.row.label)"
            :key="item"
            size="mini"
            effect="plain"
            type="success"
          >
            {{ item }}
          </el-tag>
        </template>
        <!-- 时间格式化 -->

        <template #createdAt="scope">
          <span v-if="scope.row.createdAt">
            {{ Format.formatTime(scope.row.createdAt) }}
          </span>
        </template>
      </ls-table>
    </el-col>
  </el-row>

  <div v-for="(item, index) in 100" :key="index">
    <p>{{ item }}</p>
  </div>
</template>

<script lang="ts" setup>
import { reactive, computed } from "vue"
import { BreadCrumb } from "@/components/breadCrumb"
import { LsTable } from "@/baseUI/table"
import { useStore, newUseStore } from "@/store"
import { ListUrl } from "@/service/list/types"
import { tableConfig } from "@/config/tableConfig"
import { pandaKillConfig, pandaKillTitle } from "./config/pandaKill.config"
//时间格式化
import Format from "@/utils/fotmatTime"

const store = newUseStore()
const pageInfo = reactive({
  page: 1,
  pageSize: 10
})

console.log("ddd", store.lsActions.moduleList.getListInfo)

store.dispatch(store.lsActions.moduleList.getListInfo(), {
  pageInfo,
  url: ListUrl.pandakill
})

const tableData = reactive(computed(() => store.state.moduleList.pandaKillData))
const name = store.state.name

const pandaKillTable = tableConfig
</script>
